.header {
    width: 750rpx;
    height: 800rpx;
    background-color: #01B2FF;
    background-repeat: no-repeat;
    z-index: 0;

    .tongzhi {
        width: 50rpx;
        height: 50rpx;
        position: absolute;
        top: 10rpx;
        right: 15rpx;

        image {
            width: 100%;
            height: 100%;
        }
    }

    .user-info {
        background: none;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        position: relative;
        top: 40rpx;
        color: #FFFFFF;

        .user-img {
            width: 180rpx;
            height: 180rpx;
            background-color: #FFFFFF;
            border-radius: 50%;
            overflow: hidden;
            display: flex;
            justify-content: center;
            align-items: center;

            image {
                width: 100%;
                height: 100%;
            }
        }

        .name {
            margin-top: 20rpx;
            font-size: 30rpx;
            font-weight: 600;
        }

        .tips {
            margin-top: 15rpx;
            font-size: 23rpx;
            color: #e7e4e4;
            font-weight: 300;
        }

    }

    .qiandao {
        position: absolute;
        top: 14%;
        right: 0;
        background: #FFFFFF;
        border-radius: 50rpx 0 0 50rpx;
        padding: 10rpx;
        padding-left: 30rpx;
        color: #50BEE2;
        font-size: 25rpx;
        font-weight: 600;

        image {
            width: 100%;
            height: 100%;
        }
    }
}

.user-relation {
    margin-left: 5%;
    border-radius: 10rpx;
    width: 90%;
    height: 90rpx;
    background: #FFFFFF;
    border: solid 2px #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    top: -430rpx;
    text-align: center;
    box-shadow: 0 5rpx 10rpx #a3a2a2;

    .item {
        flex: 1;
        color: #4e4e4e;

        text {
            color: #000000;
            font-weight: 600;
        }
    }
}

.tools-box {
    position: relative;
    top: -435rpx;
    margin-top: 30rpx;
    height: 350rpx;
    width: 100%;
    background-color: #FFFFFF;
    display: grid;
    grid-template-columns: repeat(4, 25%);
    grid-template-rows: repeat(2, 50%);

    .tool {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;

        image {
            width: 50rpx;
            height: 50rpx;
        }

        text {
            margin-top: 15rpx;
            font-weight: 500;
            font-size: 25rpx;
        }
    }
}

.banner {
    position: relative;
    top: -430rpx;
    margin-top: 20rpx;
    background-color: #FFFFFF;
    width: 100%;
    height: 90rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10rpx;
    padding-left: 20rpx;

    .logo {
        width: 70rpx;
        height: 70rpx;
        display: flex;
        align-items: center;
        justify-content: center;

        image {
            width: 60rpx;
            height: 70rpx;
        }
    }

    .text {
        width: 550rpx;
        display: flex;
        flex-direction: column;

        .title {
            font-weight: 700;
            font-size: 30rpx;
        }

        .content {
            font-size: 25rpx;
            color: #fd7a00;
        }
    }

    .go {
        width: 100rpx;
        height: 50rpx;

        image {
            width: 50rpx;
            height: 50rpx;
        }
    }
}

.cells {
    margin-top: 20rpx;
    position: relative;
    top: -430rpx;
    width: 100%;
    display: flex;
    flex-direction: column;

    .cell {
        margin-top: 5rpx;
        width: 100%;
        height: 80rpx;
        background-color: #FFFFFF;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10rpx;
        padding-left: 30rpx;

        .go {
            width: 100rpx;
            height: 50rpx;

            image {
                width: 50rpx;
                height: 50rpx;
            }
        }
    }
}